Old School Web Development Techniques

I've had this talk idea for a while now to go over 'Old School Web Development Techniques'.

Then, after a meetup with Todd Gardner, I remembered the idea, discussed with Todd, and he liked it.

Then, I put out a tweet and you all did a cracking job at replying :D

Here's a list of what we've gathered so far…

Thinking about old school web development techniques for a talk covering some of the following:

1px.gif
Sliding doors
Rounded corners
Tables
Clear Fix
Calculating the box model
Floats
Using lots of JavaScript / jQuery where CSS can now be used
Liquid layouts
The golden layout
Image maps
Spritesheets
Flash headings with embedded fonts
Tiled backgrounds
Conditional includes
XHTML 1.0 strict
Skip intro
Images for letters
sIFR
Cufon
Web Rings
File extensions like HTM, PHP3, CGI, PL, etc
FlashKit
Websafe colours
Jake Smith
Netscape’s viewed source blinking any invalid markup
WAV files on page load
DHTML layers
Live changes to production over FTP
No version control
Best viewed in Internet Explorer 5.0
Best viewed at 480x360
Best viewed at 800x600
Best viewed at 1024x768
Hit counters
Frames
Flash/JS Nav menus
Table layouts with images for rounded corners
JS mouse trails
  everywhere
Snow particles
Image gradients in place of CSS gradients
Transparent PNGs in place of RGBA or backgrounds
Page background colours and table cell background colours not rendering the same
Repeating page background images with transparencies so the page background colour beneath it showed through
Carving large images up into loads of smaller images to load “quicker”
When Fireworks automated image slicing you thought photoshop 4’s days were numbered.
Keyword stuffing at bottom with white text on white background
Dean Edwards' IE7
MM_ImageSwap()
GoLive CyberStudio
spacer.gif
IE hasLayout property
Spinny logos
Netscape “thumpers”
Webrings
Text-only versions for people using Lynx
Search engine submission forms
flaming 🔥 logos
Flash
Image Slicing
IE Tan Hack
IE Holly Hack
jQuery png fix for IE6
zoom: 1;
Dreamweaver
Inline CSS
Font Tags
Proprietary IE filters
Haslayout, or as i used to call it, can haz layout.
Star hack
960.gs
Faux columns. Y'know, a background image behind a container so it looks like both columns are taking the same full height?
Real Audio
Framesets
216 colours web safe
VBScript
Java applets
WSIWIG editors
Drop shadow and bevels on everything when it was introduced in Photoshop 5.5
Curled up corner effects
Big chunky menu buttons with rollover effects to make it look like they had been pressed down
"Enter this site” landing pages
“This site is under construction” (with a men at work sign)
Using PHP and JavaScript to render headings like h1 in a fancy font before there were Web Fonts
Making text colors the same as bg colors for bad SEO meta data tactics
Canvas / Flash for fonts
🚧 Under construction 🚧

Document Type Declaration

1	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd …">

Webmaster / GeoCities

1	[email protected]

Wap

1	<wml> <card id="main" title="First Card"> <p mode="wrap">This is page is optimized for the Nokia 3310.</p> </card> </wml>

Drop Shadows

1
2
3

<div class="shadow-box-top"></div>
<div class="shadow-box-content">Hello</div>
<div class="shadow-box-bottom"></div>

Blink, Marquee, Tables, Framesets, Inline Styles

<a href="javascript:void(0)">
<blink><marquee><font size="10" color="red">
<table>
<tr><td colspan="2">TABLES</td></tr>
<tr><td>FOR</td><td>LAYOUT</td></tr>
</table>
</font></marquee></blink>
</a>
<frameset>
<frame src="page.html">
</frameset>

Under Construction

1	<img src="Under%20Construction.gif">

Please reply with any others!

Document Type Declaration

Webmaster / GeoCities

Wap

Drop Shadows

Blink, Marquee, Tables, Framesets, Inline Styles

Under Construction

Browse by category: