yahew.com The tagboard

The tagboard

A chat room built out of two HTML attributes and pasted into the margin of a page about something else. There is one on this page at its real size, 250 by 200 pixels. Type in it. Then wait.

Posting is one attribute pointed at another

The board and the form are two separate documents. The form's target names the iframe. Submit it, and the browser navigates that iframe to a fresh copy of the board with your line on top. It looks like a chat application. It is 1996 HTML aimed at itself.

<iframe src="my.tag?name=tag-board" name="tag" width="250" height="200"
        marginwidth="0" marginheight="0"></iframe>

<form action="add.tag" method="post" name="tagform" target="tag">
  <input type="hidden" name="name" value="tag-board">
  Name<br>
  <input name="tagname" maxlength="20"><br>
  URL or Email<br>
  <input name="tagurl" maxlength="100" disabled><br>
  Messages(smilies)<br>
  <textarea cols="24" rows="3" name="message" wrap></textarea><br>
  <input class="button" type="submit" value="TAG">
</form>

tag-board.com, captured 2 August 2004. The board's own demonstration embed, verbatim apart from shortening two absolute URLs.

Receiving cost twenty dollars a year

Posting was the free half, and the easy half. Finding out what anybody else had written, without touching anything, was the Enhanced tier at $20/year. On a free board nothing arrived on its own. You saw new messages when you posted one, or when you reloaded the page.

Here is what the twenty dollars bought, out of the service's own mod.js:

<body onload="startTimer('tag-board','9')">

function gc() {
  hello = new Image();
  hello.src = "enhanced/getmod.tag?name=" + c + "&r=" + Math.random();
  setTimeout("gc()", 20000);
}
function cc() {
  var bd = 'my.tag?name=';
  if (gv("modn" + c) != d && gv("modn" + c) != null) {
    if (document.images) window.location.replace(bd + c + '&r=' + Math.random());
    else window.location.href = bd + c + '&r=' + Math.random();
  } else setTimeout("cc()", 1515);
}

gc requests a URL under enhanced/ as though it were an image, every twenty seconds, which is how the server got to hand back a cookie. cc reads that cookie every 1,515 milliseconds and replaces the frame when the number in it stops matching. A cookie as the transport, an Image() as the request, and a poll on the client. There is no XMLHttpRequest in it.

The '9' is not a delay. It is the board's revision number at the moment that copy of the page was rendered, and the poll is watching for it to change. With script turned off there was one fallback, and it was slower than reloading by hand:

<noscript><meta http-equiv="refresh" content="60;URL=my.tag?name=tag-board"></noscript>

Field marks

  • 250 by 200, and the form is narrower than the board. A tall column sized to sit beside content, never under it. cbox stacked two frames instead, 160 by 225 for the log and 160 by 75 for the form, the second with border-top: 0px so the seam disappeared.
  • The handle is wrapped in .: and :. and the timestamp is not on screen at all. It lives in a title attribute, so you read the clock by hovering. Hover a name in the board on this page.
  • Alternating rows are two class names, not two colors. tablebg0 and tablebg1, and the colors arrive from a stylesheet on the board owner's own server. The service shipped the banding as a hook and let you pick.
  • The button says TAG. Not Send, not Post, not Submit. The verb was the product.
  • Twenty characters of name, three rows of message. maxlength="20" and cols="24" rows="3". Nobody wrote paragraphs in a tagboard because the markup would not let them.
  • Smilies were addressed by color number. /smilies/141/shocked.gif is in the archived board: 15 by 15 pixels, 181 bytes, a blue near #399fcf, with #00ff00 burned in as the transparent key. Eighteen faces, most of them in over 250 numbered folders.
  • Twenty rows, then More -->. The board held twenty lines and everything older went behind archive.tag?name=tag-board&start=20&num=20. Try it in the board here.

One board's colors, in one board's file

The stylesheet the archived board loads sits on the customer's own domain, which is what "100% Customization" meant: they wrote the CSS themselves.

.tablebg0 { FONT-FAMILY: verdana; FONT-SIZE: 11px; text-align: justify;
             background-color:D3DEE4; border-bottom-color : #5783A2; }
.tablebg1 { FONT-FAMILY: verdana; FONT-SIZE: 11px; text-align: justify;
             background-color:95B7CB; border-bottom-color : #5883A2; }

Both background colors are missing the #. As written, neither declaration is valid CSS, and the file itself opens with a <style> tag inside a .css URL. It went up anyway, on somebody's own server, and nobody had a way to tell them. That is the whole trade in one file: the skin was yours to break.

What survived

shoutbox.com is still running. A real page, 22p2.neocities.org/shoutbox, is 525 bytes, and its entire body is two script tags and an integer:

<div>
  <script src="https://www.shoutbox.com/chat/chat.js.php"></script>
  <script> var chat = new Chat(16508); </script>
</div>

Its client now pulls jQuery 3.6.3 and socket.io and opens a connection on port 8443. Read it and there is no XMLHttpRequest, and one setInterval, which rotates an advertisement every ninety seconds. It still emits ban with an address and del with a message id. The moderation tools that cost twenty dollars in 2004 are in the free client now, and the transport went from a cookie to a socket. Nothing a person can see has changed in twenty-two years.

What changed is where you are allowed to paste it. Cbox is alive too, and its help page still troubleshoots one failure:

your web host may be removing or otherwise interfering with the HTML iframe tags that Cbox uses. Your Cbox code needs to be pasted into an area of your site that accepts HTML without modification.

The tagboard did not stop working. The places you could paste it ran out.

Back to the directory.

Sources, and what is deliberately absent

The board has not updated.
Prev The guestbook Next The stats page