Reviews Inquire

How CSS Rescues Old Websites and Makes Them Readable Again

Open a webpage archived in the early 2000s and the experience can be confronting. Text crowds against the edge of the screen, colours clash, navigation chains sit across the top in tiny blue links, and headings appear as something other than headings. Underneath that visual mess is usually perfectly readable content. The HTML is intact, the words are still there, the images load. What is missing is a coherent style sheet. Without CSS, every browser falls back to its own defaults, and the result is the unmistakable look of an unstyled document.

Cascading Style Sheets were invented precisely to lift that burden. By separating presentation from structure, CSS lets a designer, or anyone willing to write a few lines, decide how the underlying HTML should look. For old sites that were built before responsive design existed, a carefully chosen stylesheet can transform the reading experience within an afternoon. The pages stay the same, the URLs do not move, but the eyes no longer strain.

Across Australia, this matters more than it might first appear. State libraries in Melbourne and Sydney have spent years digitising community publications, small-town websites, and university research portals. Many of those archives were captured in their original form, tables and all, and they sit in collections like the Australian Web Archive waiting to be reread. A new generation of digital volunteers, many of them meeting in suburban libraries or community centres between shifts, are using CSS to make those resources accessible again on phones, laptops, and the big screens mounted in reading rooms.

How the Cascade Actually Works

Cascading Style Sheets operate on a simple hierarchy. Every rule has a selector and a declaration, and when two rules disagree, the browser asks three questions: which one is more specific, which one appears later, and which one the user has marked as important. Specificity is calculated by counting IDs, classes, and element names. An ID beats a class beats an element. That is the cascade.

For old sites, the practical implication is enormous. A stylesheet sitting at the bottom of the document overrides anything earlier. An old site might have inline styles scattered through the markup, font tags, deprecated attributes, and a half-finished embedded block. A single well-written external stylesheet, linked from the head, can sweep most of that aside. The inline styles still exist, but they lose the cascade battle.

Inheritance does the rest. Set the font family on the body element, and every paragraph, heading, and list inside it follows along. Set the line-height on the root, and the rhythm of the whole page evens out. The cascade turns one well-chosen rule into dozens of effective changes. Designers rebuilding a long-neglected archive can do in an hour what would have taken weeks of manual edits across every file.

Typography Fixes That Change Everything

Readability is mostly typography, and typography is where CSS earns its keep on legacy content. The defaults baked into browsers from the mid-1990s were designed for screens that no longer exist. Black text on grey, Times New Roman at twelve points, hyperlinks flashing blue and purple. None of it survives a careful audit.

A few key declarations go a long way:

Property Browser Default Improved Reading Value
font-size 16px 18px to 20px
line-height 1.0 to 1.2 1.55 to 1.7
max-width none 65ch to 75ch
colour browser-dependent high-contrast pair

Setting a font size above the browser default helps readers in their fifties and beyond, a meaningful consideration given that older Australians make up a large share of library and archive users. A line-height between 1.5 and 1.7 stops lines of text from crowding each other and reduces the eye fatigue that comes with long reading. Capping line length at roughly seventy characters keeps the gaze from drifting across a screen, which matters just as much on a phone as on a desktop monitor.

Australian English typography has its own quirks worth handling. Spell colour with a u. Prefer recognise, organise, and centre to the American spellings. Most modern fonts ship with British and Australian hyphenation patterns, but the language attribute on the html element still helps browsers choose the right dictionary. For content originally written in Russian, or any language that uses the Cyrillic script, an archive may need to support multiple alphabets in a single stylesheet. Resources explaining how to book an MRI under a state insurance scheme, written for Cyrillic readers, are a typical example of the kind of preserved page a volunteer might come across. Declaring a font stack with broad Unicode coverage, or relying on system fonts that ship with modern operating systems, usually solves it without further work.

Layout Restoration Without Rebuilding

Old sites were built with layout tables. Rows, columns, spacer GIFs, the whole machinery of pre-CSS design. Pulling that scaffolding apart usually breaks the content underneath. CSS now offers tools that let the tables rest in peace.

The first move is to set a sensible max-width on the main container, centre it, and add generous padding on either side. That single block of CSS rescues dozens of pages at once. From there, flexbox handles the navigation bar, replacing a chain of inline images or a table cell with a row of links that wraps gracefully on a phone. CSS Grid handles two-column layouts that used to require a nested table, including the sidebars that so many Australian community sites relied on in the early 2000s.

The temptation to rewrite the HTML is strong, but it is rarely necessary. Replacing a deprecated attribute here, swapping a presentational element for a semantic one there, those small changes preserve the original content while making it respond to modern CSS. Anyone restoring an archive should keep a backup of the original markup before any edit, because once you start pulling threads, the whole jumper can unravel.

Browser Compatibility and the Long Tail

An old site might be opened today in the latest Chrome on a MacBook, in Safari on an iPad, in Firefox on a Linux workstation, in Edge on a Surface, and in a five-year-old browser still running on a library terminal. CSS has grown enormously since CSS 2.1, and the long tail of older browsers does not support the newer properties. The wise move is to write CSS that uses modern features with simple fallbacks.

A display grid rule followed by a display flex rule and then a simple display inline-block will let older browsers use the last declaration they understand. Newer browsers pick up the grid. The content stays readable across the entire spectrum. Vendor prefixes, once a tedious necessity, are now mostly unnecessary, but a quick check with the archived news section of a long-running community site can reveal which browsers their actual visitors use. Audience matters more than theory.

For Australian audiences in particular, the rollout of the National Broadband Network over the past decade has shifted browsing habits heavily toward mobile and tablet devices. A stylesheet that looks elegant on a widescreen monitor but breaks on a six-inch screen is failing more than half of its visitors. Mobile-first CSS, written for the narrowest viewport first and broadened up, matches how most readers actually arrive.

Reading Improvements That Take Minutes

A short checklist helps when time is limited. The four adjustments below cover most of the readability problems found in archived Australian community sites, from suburban footy club pages to long-running professional practices whose .com.au domains date back to the late 1990s:

Each item takes minutes to apply and produces immediate gains in legibility. None of them require rebuilding the underlying HTML. Together they cover roughly eighty per cent of the problems encountered in a typical preservation project, leaving the deeper structural work for those who have time to spend on it.

Choosing Where to Invest Restoration Effort

Not every page deserves a full rebuild. Sites fall into a few common categories, and the right CSS treatment depends on which one applies. A simple flyer-style site, originally intended as a single long page, only needs a clean typography pass and a sensible reading width. A small business presence with a handful of static pages can be transformed with a single linked stylesheet and a small handful of layout rules. A complex archive with hundreds of pages and a custom backend benefits from a full audit, but the audit itself is mostly CSS work.

A useful decision is whether the project needs a brand-new landing page or a full website restoration. The trade-off is real, and the choosing between a landing page and a full website discussion covers the considerations in more detail than fits here. For most preservation projects, a thoughtful CSS layer over the existing HTML is the more respectful choice. The content stays where it was, the URLs survive, and the site becomes readable without losing its history.

A handful of tools make the work lighter:

CSS does not just decorate old sites. It rescues them. By layering a thoughtful stylesheet over an archive, a volunteer, a librarian, or a curious owner can hand a tired HTML document back to readers of any age, on any screen, from a regional Queensland library terminal to a Sydney café phone. The words were always there. Browse the preserved materials, send through any questions, and the person behind the project is happy to hear from anyone keen on lending a hand.