A sewing page that never closed its font size HTML tags

It’s quite likely this site was already broken in other browsers, or even other versions of IE. And really, it’s not even broken now, the content does render. It’s just difficult to use.

And it’s not as if there aren’t a slew of sites that render differently on Wayback for a variety of reasons. This is in no way meant to disparage the Internet Archive, but I don’t think it’s a reasonable expectation that a site hosted in a way it wasn’t set up by its creators will always accurately render the way it did in its original context.

And if so what godforsaken reason would you have for doing that.

I wonder if internally, browsers now convert and parse old <font> tags as <style> tags which would explain the modern behaviour.

and guess what, this page was made with

    <meta name="generator" content="Microsoft FrontPage 5.0">

If a font tag automatically closed a previous font tag, then you couldn't have nested font styles (e.g giving a word a different color than the containing text). But this have always been possible, otherwise the font element would be next to useless.

Bolted on design took a front seat, but it shouldn't have been our focus.

Open-ended CSS enabled us to reinvent styling and designs over and over and over. We've spent countless hours as a species grappling with how to present information, and how to reinvent the wheel. (Every brand needs to feel special, every company needs a design system.)

If these hours had been spent on semantics and reusability, we might have arrived at a different future. Perhaps rich document sharing rather than a web that's about who can have the fanciest scrolling upvote attention grabbers.

There were some bold ideas in the semantic web, microformats, RSS/RDF. Imagine sharing news and articles like P2P, insightful comments being ranked and scored, interest graphs being cultivated to better you rather than get you to like/subscribe. Platforms as an open and extensible standard.

CSS, meanwhile, is a tool that's being used to position a smiling alien creature that tells you to log into the mobile version.

We focused on the wrong things and evolved in the wrong direction. Shiny and flashy distracted us from rigor and enlightenment.

Here's a snippet of relevant page source:

    <tr><td><h3><font color="red"><font face="arial">Improper Thread <br><width="25%" align="left"></font><font color="#0033FF"><font face="arial"> Try re-threading the machine; make sure the thread goes through all guides.</font></td></tr>
    <tr><td><h3><font color="red"><font face="arial">Burrs <br><width="25%" align="left"></font><font color="0033FF"><font face="arial">There may be burrs in the needle's eye, on the thread guides, needle plate or the hook. Replace the needle and try buffing the thread guides and needle plate. Buffing may alter the timing, so it's a good idea to replace a damaged hook.</font></td></tr>

(Granted, there is no <table> containing these <tr> and <td> elements...)

> font-size: 1.17em;

Where is this applied? I'm looking in the page source and there are only six instances of `font-size`, none of which match this. There's one `<style>`, which doesn't have a font-size and doesn't style h3 tags. The string "1.17" does not appear in the source. The page inspector shows no styling applied to h3 elements.

    <style>
      * * {
        font-size: 120%;
      }
    </style>
    <div>
      Hello
      <div>
        Hello
        <div>
          Hello
          <div>
            Hello
            <div>
              Hello
            </div>
          </div>
        </div>
      </div>
    </div>